{% extends "../layout/base.html" %}
{% import "../layout/side.html" as side %}

<!--样式引入-->
{% block link %}
<link rel="stylesheet" type="text/css" href="/public/css/jquery.page.css" >
{% endblock %}

<!--侧边栏-->
{% block side %}
    {{ side.aside('users') }}
{% endblock %}

<!--中间内容-->
{% block content %}
<section class="content">
    <div class="card">
        <div class="card-header">
            <h3 class="card-title">用户列表</h3>
        </div>
        <!-- /.card-header -->
        <div class="card-body table-responsive p-0">
            <table class="table table-hover text-wrap table-bordered">
                <thead>
                <tr>
                    <th>ID</th>
                    <th>账号</th>
                    <th>昵称</th>
                    <th>性别</th>
                    <th>邮箱</th>
                    <th>电话</th>
                    <th>创建时间</th>
                </tr>
                </thead>
                <tbody>
                {% for item in rows %}
                <tr>
                    <td>{{item.id}}</td>
                    <td>{{item.username}}</td>
                    <td>{{item.nickname}}</td>
                    <td>
                        {% if item.gender == 1 %}
                        <span class="badge badge-primary">男</span>
                        {% elif item.gender == 2 %}
                        <span class="badge badge-danger">女</span>
                        {% else %}
                        <span class="badge badge-dark">未知</span>
                        {% endif %}
                    </td>
                    <td>{{item.email}}</td>
                    <td>{{item.phone}}</td>
                    <td>{{item.createdAt}}</td>
                </tr>
                {% else %}
                <tr>
                    <td colspan="8">暂未数据</td>
                </tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
        <!-- /.card-body -->
    </div>
    <div class="card-footer clearfix">
        <!--分页-->
        <div id="page" class="page"></div>
    </div>
</section>
{% endblock %}

<!--JS引入-->
{% block scripts %}
<script type="text/javascript" src="/public/js/jquery.pagination.min.js"></script>
<script type="text/javascript">
  let countPage = '{{total}}';
  let current = '{{page}}';
  let toUrl ='/admin/users'; //获取请求的url
  window.onload=function(){
    configPage(countPage,current,toUrl);
  };

</script>

{% endblock %}
